<template>
  <div class="son" style="border: 3px solid #000; margin: 10px">
    我是Son组件 --- {{ title }} --- {{ hobby }}
    <div>
      <button @click="changeTitle">修改标题</button>
      <button @click="changeHobby">修改爱好</button>
    </div>
  </div>
</template>

<script>
export default {
  name: "Son-Child",
  props: ["title", "hobby"],
  methods: {
    changeTitle() {
      // 1. 通过给父组件发射自定义事件传递要修改的值
      // this.$emit('自定义事件名称', 传递的值)
      this.$emit("changeTitle", "学前端, 来黑马!!!");
    },

    changeHobby() {
      this.$emit("changeHobby", "大保健");
    },
  },
};
</script>

<style>
</style>